<%@include file="/WEB-INF/jsp/common/taglibs.jsp"%>

<s:layout-render name="/WEB-INF/jsp/common/layout_main.jsp"
                 title="Group Dashboard">
    <s:layout-component name="body">
        <s:messages/>
        <script type="text/javascript">

            jQuery(document).ready(function() {
                jQuery('#mycarousel').jcarousel({
                    wrap: 'circular'
                });
            });

        </script>
        <div style="width: 1260px; height: 820px;">
            <div id="divleft" style="height:100%; width: 285px;"> 
                <div id="divwelcome">
                    <span>&nbsp;Welcome</span> <br/><br/>
                    <img alt="" align="left" border="0" src="images/tobab.png" width="90px" height="100px" style="margin-left:10px; margin-right:10px;"><br/><br/>
                    <span>Torab</span><br/>
                    <span>Torabi</span><br/><br/>
                    <br/><br/>
                    <div style="border: 1px solid #cccccc; background-color:#f7f7f7; width:275px;"> 
                        <img alt="" style="margin-left: 10px;" border="0" src="images/add_blue.png" width="20px" height="20px"><a style="color: #404040; font-size: 12px;">Add New Widget</a><img alt="" border="0" width="20px" height="20px" src="images/select_option.png" style="margin-left: 10px;"> <a style="color: #404040; font-size: 12px;">Customize</a>
                    </div>
                </div>
                <br/>
                <!-- My Group List-->
                <div class="divborder1" style="width:250px;" align="center">
                    <div class="boxTitle1"><div class="boxTitle2">My Group List</div></div>
                    <div class="boxMiddle"><div style="margin-top:8px; margin-left:10px;">List of all my groups and Roles</div></div>

                    <div  id="wrapgroup" style="height: 204px;">
                        <%
                            for (int i = 0; i < 5; i++) {

                        %>
                        <div class="boxtag" onmouseout="style.backgroundColor='white'" onmouseover="style.backgroundColor='#84C1DF'">
                            <div><img class="boxtagImg"   alt="" align="left" border="0" src="images/group1.png"></div>
                            <div class="boxtagTitle" align="left"> DSE Victoria </div>
                            <div class="boxtagText">Administrator</div>
                        </div>

                        <%  }

                        %>  
                    </div><!-- End wrap  -->

                    <div class="boxfooter" style="height:10px;">
                    </div>
                </div>
                <!-- End My Group List-->
                <br/>
                <!-- Member List-->
                <div class="divborder1" style="width:250px;" align="center">
                    <div class="boxTitle1"><div class="boxTitle2">Member List</div></div>
                    <div class="boxMiddle"><div style="margin-top:8px; margin-left:10px;">List of all the members of my group</div></div>

                    <div  id="wrapgroup" style="height: 204px;">
                        <%
                            for (int i = 0; i < 5; i++) {

                        %>
                        <div class="boxtag" onmouseout="style.backgroundColor='white'" onmouseover="style.backgroundColor='#84C1DF'">
                            <div><img class="boxtagImg"   alt="" align="left" border="0" src="images/camila.png" width="40px" height="44px"></div>
                            <div class="boxtagTitle" align="left"> Camilla Gonzalez </div>
                            <div class="boxtagText"><span>Admin - </span><a style="color: #404040; font-size: 10px;">Send Message</a></div>
                        </div>

                        <%  }

                        %>  
                    </div><!-- End wrap  -->

                    <div class="boxfooter" style="height:10px;">
                    </div>
                </div>
                <!-- End Member List-->

                <br/>
            </div>
            <div id="divright" style="height:100%; width: auto; margin-left: 10px;">
                <br/>
                <span style="font-size:24px;">DASHBOARD - Novum Apparatus</span>
                <br/><br/>
                <div style="position:relative; float: left; width:600px;"><img alt="" border="0" src="images/searchbox.png"><img alt="" style="margin-left: -6px; margin-top: -3px;" border="0" src="images/searchbox2.png"></div>

                <!-- Notification List-->
                <div class="divborder1" style="width:330px; float: left;" align="center">
                    <div class="boxTitle1"><div class="boxTitle2">Notification List</div></div>
                    <div class="boxMiddle"><div style="margin-top:8px; margin-left:10px;">Notifications</div></div>

                    <div  id="wrapgroup" style="height:234px;">
                        <%
                            for (int i = 0; i < 5; i++) {

                        %>
                        <div class="boxtag" style="height: 70px;" onmouseout="style.backgroundColor='white'" onmouseover="style.backgroundColor='#84C1DF'">
                            <div><img class="boxtagImg"   alt="" align="left" border="0" src="images/camila.png" width="40px" height="44px"></div>
                            <div class="boxtagTitle" align="left" style="font-size:10px; margin-top: 0px;"> Camilla Gonzalez </div>
                            <div class="boxtagText" style="width:250px;">The Victorian Property Sales Report containing the latest quarterly data is now available.<br/>
                                <img alt="" border="0" src="images/calendar.png">&nbsp; <span style="font-size: 10px; color: #999;">22 hours ago</span></div>
                        </div>

                        <%  }

                        %>  
                    </div><!-- End wrap  -->

                    <div class="boxfooter" style="height:10px;">
                    </div>
                </div>
                <!-- End Notification List-->


                <br/><br/>
                <div class="linediv" style="border:1px solid #999; width:945px; margin-top: 300px;"></div>
                <br/><br/>
                <div id="addash">
                    <%@ include file="advertising.jsp" %>
                </div>

            </div>
        </div>  
    </s:layout-component>
</s:layout-render>